<template>
  <div id="app">
      <!-- 主要内容 -->
      <!-- 缓存组件 include包含Home组件多个组件用逗号隔开 组件中必须有name属性 -->
      <keep-alive include="Home,Question,UserPage">
        <router-view class="body" name="body"></router-view>
      </keep-alive>
      <!-- 底部导航 -->
      <router-view class="footer"></router-view>
  </div>
</template>

<style lang="less" scoped>
#app {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.body {
  height: 100%;
}

#app .body {
  flex: 1;
  overflow: hidden;
}
.box {
  width: 150px;
  height: 48px;
  background: red;
}
</style>
